<template>
  <view class="page">
    <view class="xb-info">
      <view>
        <text>姓名</text>
        <input type="text" v-model="infor.complaint" placeholder="请输入姓名" placeholder-class="inputClass" />
      </view>
      <view>
        <text>联系电话</text>
        <input type="number" v-model="infor.phone" placeholder="请输入联系电话" placeholder-class="inputClass" />
      </view>
    </view>

    <div class="xb-info">
      <view class="flex-col" style="flex-direction: column;justify-content: flex-start;">
        <text style="text-align: left;justify-content: flex-start;width: 100%;">投诉内容</text>
        <textarea auto-height maxlength="200" v-model="infor.content" placeholder="请输入最多200个字符…" placeholder-class="inputClass"></textarea>
      </view>
    </div>

    <view class="xb-bottom-btn" @click="btnClickFn">
      提交
    </view>
		
    <postSuccess v-if="showSuccess"></postSuccess>
  </view>
</template>

<script>
export default {
  data() {
    return {
      infor: {
        "complaint": "",
        "phone": "",
        "content": "",
        "complaintTime": null,
      },
      showSuccess:false,
      vehicleOptions:[],
      showVehiclePicker:false
    };
  },
  onLoad() {
  },
  methods: {
    btnClickFn(){
      let rules = [
        {name: 'complaint',type: 'required', errmsg: '请输入姓名'},
        {name: 'content', type: 'required', errmsg: '请输入访问目的'},
        {name: 'phone',required:true, type: 'phone', errmsg: '请输入正确联系电话'},
      ]
      let valLoginRes = this.$validate.validate(this.infor, rules)

      if (!valLoginRes.isOk) {
        uni.showToast({
          icon: 'none',
          title: valLoginRes.errmsg
        })
        return false
      }else{
        this.infor.complaintTime=this.$u.timeFormat(Date.now(), 'yyyy-mm-dd hh:MM:ss')
        this.apis.parkApi.wyComplaint(this.infor).then(res=>{
          if(res.code===200){
            this.resetForm()
            this.showSuccess=true
          }
        })
      }
    },
    vehicleConfirm(op){
      this.infor.vehicle=this.vehicleOptions[op[0]].dictLabel
    },
    resetForm(){
      this.info={
        "complaint": "",
        "phone": "",
        "content": "",
        "complaintTime": null,
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.page{
  padding-bottom: 112rpx;
}

</style>
